<template>
  <div class="body">
    <NavbarTurn @func="getMsgFormSon" @func1="getMsgFormSon1" @func2="getMsgFormSon2"></NavbarTurn>
    <div :style="{marginTop: (msgFormSon+msgFormSon1+5)+ 'px'}"></div>
    <div v-for="(item,index) in allAddress" class="content" :key="index" @click="goBack(index,allAddress)">
      <div class="content2">
        <text class="font">{{item.memberName}}</text>
        <text class="font">{{item.memberPhone}}</text>
        <text class="font" v-if="item.isDefault">[默认地址]</text>
        <!--<text class="font5" v-if="!item.isDefault" @click="goModifyAddress(index,allAddress)">编辑</text>-->
      </div>
      <text class="font2">{{item.maProvince}}{{item.maCity}}{{item.maArea}}{{item.maDetail}}</text>
      <div class="content3" @click="goModifyAddress(index,allAddress)">
        <text class="font3">编辑</text>
      </div>
    </div>
    <button class="btn" @click="goAddAddress">
      <text class="font4">新增地址</text>
    </button>
  </div>
</template>

<script>
  import NavbarTurn from "../../components/narbarTurn";
  import { chooseAddress } from "./index";
  export default {
    components: {
      NavbarTurn,
    },
    data() {
      return {
        name:'',
        phone:'',
        address:"",
        isDefault: 0,
        allAddress:[],
        msgFormSon: '',
        msgFormSon1: '',
      }
    },
    onShow(){
      this.$request.post({
        url: '/api/memberAddress/query',
        data: {
          'isDefault':0,
        }
      }).then(res => {
        console.log(res);
        this.allAddress = res;
      })
    },
    methods: {
      getMsgFormSon(data) {
        this.msgFormSon = data;
      },
      getMsgFormSon1(data) {
        this.msgFormSon1 = data;
      },
      goModifyAddress(index,allAddress){
        wx.navigateTo({
          url:'/pages/modifyAddress/main?maId=' + allAddress[index].maId
        });
      },
      goAddAddress(){
        wx.navigateTo({
          url:'/pages/addAddress/main'
        });
      },
      goBack(index,allAddress){
        wx.navigateTo({
          url:'/pages/orderConfirmed/main?name=' + allAddress[index].memberName + '&phone=' + allAddress[index].memberPhone + '&maProvince=' + allAddress[index].maProvince +
            '&maCity=' + allAddress[index].maCity + '&maArea=' + allAddress[index].maArea + '&maDetail=' + allAddress[index].maDetail
        });
      }
    },
  }
</script>

<style scoped>
  .body{
    background:rgba(244,244,244,1);
    width: 100%;
    height: 100%;
  }
  .content{
    margin-top: 8px;
    width:375px;
    height:62px;
    background:rgba(255,255,255,1);
    display: flex;
    flex-direction: column;
  }
  .content2{
    display: flex;
    flex-direction: row;
  }
  .font{
    height:17px;
    font-size:15px;
    font-family:PingFangSC-Regular,PingFang SC;
    font-weight:400;
    color:rgba(102,102,102,1);
    line-height:17px;
    margin-top:10px;
    margin-left: 20px;
  }
  .font2{
    width:300px;
    height:17px;
    font-size:12px;
    font-family:PingFangSC-Regular,PingFang SC;
    overflow: hidden;
    display:-webkit-box;
    text-overflow: ellipsis;
    -webkit-line-clamp:1;
    -webkit-box-orient:vertical;
    font-weight:400;
    color:rgba(102,102,102,1);
    line-height:17px;
    margin-top:10px;
    margin-left: 20px;
  }
  .font3{
    height:17px;
    font-size:16px;
    font-family:PingFangSC-Regular,PingFang SC;
    font-weight:400;
    color:grey;
    line-height:17px;
    margin-top:10px;
  }
  .btn{
    display: flex;
    flex-direction: row;
    width:325px;
    height:36px;
    background:rgba(144,42,38,1);
    border-radius:4px;
    position:fixed;
    bottom:25px;
    left:25px;
  }
  .font4{
    height:20px;
    font-size:14px;
    font-family:PingFangSC-Medium,PingFang SC;
    font-weight:500;
    color:rgba(255,255,255,1);
    line-height:20px;
    margin-top:8px ;
    margin-left: 130px;
  }
  .font5{
    height:17px;
    font-size:16px;
    font-family:PingFangSC-Regular,PingFang SC;
    font-weight:400;
    color:grey;
    line-height:17px;
    margin-top:10px;
    margin-left: 145px;
  }
  .content3{
    position:absolute;
    margin-top:5px;
    right: 20px;
  }
</style>
